<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <link rel="icon" href="/favicon.ico">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.staticfile.org/vue/3.2.36/vue.global.min.js"></script>
  <script src="https://unpkg.com/vue@next"></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  <script src=""></script>
</head>
<body>
  <!--  -->
  <div id="app">
    <!-- cityInfo:{{cityInfo}} -->
    infos:{{infos.data}}
  </div>
  <script>
     const app={
      data(){
        return {
          // cityInfo:'',
          infos:''
        }
      },
      mounted(){
        axios.get('http://t.weather.itboy.net/api/weather/city/101030100')
        .then(response => (this.infos = response))
        // .then(function(response){
        //   console.log("response:",response)
        //   console.log("response.data.cityInfo:",response.data.cityInfo)
        //   console.log("response.data.data:",response.data.data)

        // })
      }
     }
     Vue.createApp(app).mount('#app')
  </script>
</body>

</html>
